.container{
    width: 1000px;
    height: 500px;
    /* background-color: rgb(56, 56, 56); */
    position: absolute;
    left: 50%;
    top: 50%;
    /* transform: translate(-50%,-50%) rotateX(45deg) ; */
    transform: translate(-50%,-50%) rotateX(-5deg);
    transform-style: preserve-3d;
    /* perspective: 5400px; */
    animation: round 10s linear infinite;

}
@keyframes round{
    0%{}
    100%{
        transform: translate(-50%,-50%) rotateX(-5deg) rotateY(360deg);
    }
}
.item{
    width: 250px;
    height: 350px;
    outline: 1px solid red;
    background-position: center;
    background-size: cover;
    position: absolute;
    top:calc(50% - 350px/2);
    left:calc(50% - 250px/2);
}

.item:nth-child(1){
    background-image: url(../img/1.jpg);
    transform: translateZ(350px);
}
.item:nth-child(2){
    background-image: url(../img/2.jpg);
    transform: rotateY(45deg) translateZ(350px) ;
}
.item:nth-child(3){
    background-image: url(../img/3.jpg);
    transform: rotateY(90deg) translateZ(350px) ;
}
.item:nth-child(4){
    background-image: url(../img/4.jpg);
    transform: rotateY(135deg) translateZ(350px) ;
}
.item:nth-child(5){
    background-image: url(../img/5.jpg);
    transform: rotateY(180deg) translateZ(350px) ;
}
.item:nth-child(6){
    background-image: url(../img/6.jpg);
    transform:rotateY(225deg) translateZ(350px) ;
}
.item:nth-child(7){
    background-image: url(../img/7.jpg);
    transform: rotateY(270deg) translateZ(350px) ;
}
.item:nth-child(8){
    background-image: url(../img/8.jpg);
    transform: rotateY(315deg) translateZ(350px) ;
}